<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Vue设值语法2</title>
    <script src="../js/vue.min.js"></script>
</head>
<body>
<div id="d">
    <h2>计算属性</h2>
    姓名: <span>{{name}}</span>
</div>
<script>
    var v = new Vue({
        el : "#d",
        data : {
            xing : "张",
            ming : "三",
        },
        computed : {
            // 只读计算属性
            name(){
                return this.xing + this.ming;
            },
            // 可读写的计算属性
            name1 : {
                // 取值方法
                get(){
                    return this.xing + this.ming;
                },
                // 设值方法
                set(value){
                   this.xing = value.substring(0,1);
                   this.ming = value.substring(1);
                }
            }
        }

    })
</script>
</body>
</html>